<template>
  <div class="modal-wrapper" v-loading="loading">
    <panel ref="panel" :source="source" :imageInfo="imageInfo"></panel>
    <div class="dialog-footer-account">
      <el-button @click="cancel">取 消</el-button>
      <el-button type="primary" @click="save">确 认</el-button>
    </div>
  </div>
</template>

<script>
import { detailMixins } from '../../mixins.js';

import panel from './panel';
export default {
  mixins: [detailMixins],
  components: {
    panel,
  },
  props: {
    imageInfo: {
      type: Object,
      default: function () { return {}; }
    }
  },
  data () {
    return {
      source: '',
      loading: false,
    }
  },
  methods: {
    show () {
      this.source = this.imageInfo && this.imageInfo.relativePath ? this.imageInfo.relativePath : '';
      this.$nextTick(() => {
        this.$refs.panel.init();
      });
    },
    async save () {
      this.$emit('submit');
      this.$emit('close');
    },
    async save1 () {
      const result = this.$refs.panel.getResult();
      const params = {
        picId: this.imageInfo.id,
        list: [],
      };
      params.list = result.map(item => {
        const row = {
          calibrationDetailId: this.id,
          calibrationId: this.calibrationId,
          classifyName: item.classifyName,
          creator: this.finisher,
          picId: this.imageInfo.id,
          points: item.points,
        };
        if (item.classifyId) {
          row.classifyId = item.classifyId;
        }
        return row;
      });
      // /*
      this.loading = true;
      try {
        const res = await this.$store.dispatch('tagAdminCalibrationIdBatchSaveImgLabels', params);
        const result = res.data || {};
        if (result.success) {
          const data = result.data || {};
          this.$message({ type: 'success', message: '保存成功' });
          this.$emit('submit');
          this.$emit('close');
        } else {
          this.$message({ type: 'error', message: '保存失败' });
        }
      } catch (e) {
        console.error(e);
      }
      this.loading = false;
      // */
    },
    cancel () {
      this.$emit('close');
    }
  }
}
</script>
<style lang="less" scoped>
.dialog-footer-account {
  margin-top: 20px;
}
</style>
